<template>
  <div>
    <test></test>
    <v-header :channel="channel" :banner="banner"></v-header>
    <v-split></v-split>
    <v-direct-supply :brandList="brandList"></v-direct-supply>
    <v-split></v-split>
    <v-recommend :recommend="newRecommend"></v-recommend>
    <v-across :optimization="newGooos"></v-across>
    <v-split></v-split>
    <v-recommend :recommend="HotRecommend"></v-recommend>
    <v-across :optimization="hotGoods"></v-across>
    <v-split></v-split>
    <v-special :topicList="topicList"></v-special>
    <v-split></v-split>
    <v-recommend-goods :goodsList="goodsList"></v-recommend-goods>
  </div>
</template>

<script>
import {get} from '@/utils'
import vSplit from '@/components/split'
import vHeader from './header'
import vDirectSupply from './directSupply'
import vRecommend from './recommend'
import vAcross from './across'
import vSpecial from './special'
import vRecommendGoods from './recommendGoods'

export default {
  data () {
    return {
      banner: [],
      channel: [],
      brandList: [],
      newRecommend: {
        bgUrl: 'url(../../../static/img/bgnew.png)',
        text: '新品首发',
        backgroundColor: '#D8E5F1',
        color: '#8BA0B6',
        type: 'new'
      },
      HotRecommend: {
        bgUrl: 'url(../../../static/img/bgtopic.png)',
        text: '人气推荐 · 好物推荐',
        backgroundColor: '#F4E9CB',
        color: '#B4A078',
        type: 'hot'
      },
      newGooos: [],
      hotGoods: [],
      topicList: [],
      goodsList: []
    }
  },
  async mounted () {
    const res = await get('/weapp/home')
    this.banner = res.banner
    this.channel = res.channel
    this.brandList = res.brandList
    this.newGooos = res.newGoos
    this.hotGoods = res.hotGoods
    this.topicList = res.topicList
    this.goodsList = res.newCategoryList
    // console.log(this.newCategoryList)
  },
  components: {
    vHeader,
    vSplit,
    vDirectSupply,
    vRecommend,
    vAcross,
    vSpecial,
    vRecommendGoods
  }
}
</script>

<style scoped>
</style>
